﻿<Window x:Class="WpfControlsAndAPIs.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfControlsAndAPIs"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="800">
    <Window.Resources>
        <local:MyDoubleConverter x:Key="DoubleConverter"/>
    </Window.Resources>
    <Grid>
        <TabControl Name="MyTabControl" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
            <TabItem Header="Ink API">
                <!--<Grid Background="#FFE5E5E5"/>-->
                <StackPanel Background="#FFE5E5E5">
                    <ToolBar Name="InkToolBar" Height="60">
                        <Border Margin="0,2,0,2.4" Width="280" VerticalAlignment="Center">
                            <WrapPanel>
                                <RadioButton x:Name="inkRadio" Margin="5,10" Content="Ink Mode!" Click="RadioButtonClicked" IsChecked="True" />
                                <RadioButton x:Name="eraseRadio" Margin="5,10" Content="Erase Mode!" Click="RadioButtonClicked" />
                                <RadioButton x:Name="selectRadio" Margin="5,10" Content="Select Mode!" Click="RadioButtonClicked" />
                            </WrapPanel>
                        </Border>
                        <Separator/>
                        <ComboBox x:Name="comboColors" Width="175" Margin="10,0,0,0" SelectionChanged="ColorChanged">
                            <StackPanel Orientation ="Horizontal" Tag="Red">
                                <Ellipse Fill ="Red" Height ="50" Width ="50"/>
                                <Label FontSize ="20" HorizontalAlignment="Center"
                                       VerticalAlignment="Center" Content="Red"/>
                            </StackPanel>

                            <StackPanel Orientation ="Horizontal" Tag="Green">
                                <Ellipse Fill ="Green" Height ="50" Width ="50"/>
                                <Label FontSize ="20" HorizontalAlignment="Center"
                                       VerticalAlignment="Center" Content="Green"/>
                            </StackPanel>

                            <StackPanel Orientation ="Horizontal" Tag="Blue">
                                <Ellipse Fill ="Blue" Height ="50" Width ="50"/>
                                <Label FontSize ="20" HorizontalAlignment="Center"
                                       VerticalAlignment="Center" Content="Blue"/>
                            </StackPanel>
                        </ComboBox>
                        <Separator/>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Button Grid.Column="0" x:Name="btnSave" Margin="10,10" Width="70" Content="Save Data" Click="SaveData"/>
                            <Button Grid.Column="1" x:Name="btnLoad" Margin="10,10" Width="70" Content="Load Data" Click="LoadData"/>
                            <Button Grid.Column="2" x:Name="btnClear" Margin="10,10" Width="70" Content="Clear" Click="Clear"/>
                        </Grid>
                    </ToolBar>
                    <InkCanvas x:Name="MyInkCanvas" Background="#FFB6F4F1" />
                </StackPanel>
            </TabItem>
            <TabItem x:Name="tabDataBinding" Header="Data Binding">
                <StackPanel Background="#FFE5E5E5" DataContext = "{Binding ElementName=mySB}">
                    <Label Content="Move the scroll bar to see the current value"/>

                    <!-- The scrollbar's value is the source of this data bind. -->
                    <ScrollBar x:Name="mySB" Orientation="Horizontal" Height="30"
                               Minimum = "1" Maximum = "100" LargeChange="1" SmallChange="1"/>

                    <!-- The label's content will be bound to the scroll bar! -->
                    <!--<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2" Content = "0"/>-->
                    <!--<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2"
                           Content = "{Binding Path=Value, ElementName=mySB}"/>-->
                    <!-- Breaking object/value apart via DataContext -->
                    <!--<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2"
                           DataContext = "{Binding ElementName=mySB}" Content = "{Binding Path=Value}" />-->
                    <!--<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2"
                           Content = "{Binding Path=Value}" ContentStringFormat="The value is: {0:F0}"/>-->
                    <!--<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2"
                           Content = "{Binding Path=Value}" ContentStringFormat="{}{0:F0}"/>-->
                    <!--<Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2"
                           Content = "{Binding Path=Value, Converter={StaticResource DoubleConverter}}"/>-->
                    <Label x:Name="labelSBThumb" Height="30" BorderBrush="Blue" BorderThickness="2" />
                    <Button Content="Click" Height="200" FontSize="{Binding Path=Value}"></Button>

                </StackPanel>
            </TabItem>
            <TabItem x:Name="tabDataGrid" Header="DataGrid">
                <StackPanel>
                    <DataGrid x:Name="gridInventory" Height="288"/>
                </StackPanel>
            </TabItem>
        </TabControl>
    </Grid>
</Window>
